<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui">
<h:head>
	<title>#{msg.etiqueta_UEC}</title>
	<meta charset="utf-8" />
	<meta name="description" content="Place your description here" />
	<meta name="keywords" content="put, your, keyword, here" />
	<meta name="author"
		content="Templates.com - website templates provider" />


	<h:outputStylesheet library="css" name="reset.css" />
	<h:outputStylesheet library="css" name="style-uec.css" />

	<h:outputScript library="primefaces/jquery" name="jquery.js" />

	<h:outputScript library="js" name="cufon-yui.js" />
	<h:outputScript library="js" name="cufon-replace.js" />
	<h:outputScript library="js" name="Myriad_Pro_300.font.js" />
	<h:outputScript library="js" name="Myriad_Pro_400.font.js" />
	<h:outputScript library="js" name="script.js" />

</h:head>

<h:body id="page1">
	<form jsfc="h:form">
		<div class="wrap">
			<!-- header -->
			<div class="header">
				<h:panelGroup layout="block" class="container">
					<h1>
						<h:commandLink value="Student's site"
							icon="#{resource['images/icons:home.png']}"
							action="/pages/index.jsf" />

					</h1>
					<nav>
					<ul>
						<li>
							<h:commandLink value="#{msg.etiqueta_Inicio}" action="/pages/index.jsf" styleClass="m1" />
						</li>

						<li>
							<h:commandLink value="#{msg.etiqueta_nosotros}" action="/pages/about.jsf" styleClass="m2" />
						</li>

						<li>
							<h:commandLink value="Artículos" action="/pages/articles.jsf" styleClass="m3" />
						</li>
						
						<li class="current">
							<h:commandLink value="#{msg.etiqueta_contacto}" action="/pages/contact.jsf" styleClass="m4"/>
						</li>
<!-- 						<li class="last"><a href="sitemap.html" class="m5">Site Map</a></li> -->
					</ul>
					</nav>
					<div id="search-form">
						<fieldset>
							<div class="rowElem">
								<input type="text" /> <a href="#" onClick="document.getElementById('search-form').submit()">Search</a>
							</div>
						</fieldset>
					</div>
				</h:panelGroup>
			</div>
			<div class="container">
				<!-- aside -->

				<div class="aside">
					<h3>Categorias</h3>
					<ul class="categories">
						<li>
							<span> 
								<h:commandLink value="#{msg.etiqueta_programas}" action="/pages/programas.jsf?faces-redirect=true" title="Programas que la UEC ofrece" />
							</span>
						</li>
						<li><span><h:commandLink value="#{msg.informacion_estudiante}" action="/pages/ficha-estudiante.jsf" /> </span></li>
						<li><span><h:commandLink value="Información" action="/pages/about.jsf" styleClass="m2" /></span></li>
					</ul>
					<div id="newsletter-form">
						<fieldset>
							<div class="rowElem">
								<h2>Newsletter</h2>
								<input type="email" value="Enter Your Email Here"
									onFocus="if(this.value=='Enter Your Email Here'){this.value=''}"
									onBlur="if(this.value==''){this.value='Enter Your Email Here'}" />
								<div class="clear">
									<a href="#" class="fleft">Unsubscribe</a><a href="#"
										class="fright"
										onClick="document.getElementById('newsletter-form').submit()">Submit</a>
								</div>
							</div>
						</fieldset>
					</div>
					<h2>
						Noticias
					</h2>
					<ul class="news">
						<li><strong>June 30, 2010</strong>
							<h4>
								<a href="#">Sed ut perspiciatis unde</a>
							</h4> Sed ut perspiciatis unde omnis iste natus error sit voluptatem
							accusantium doloremque.</li>
						<li><strong>June 14, 2010</strong>
							<h4>
								<a href="#">Neque porro quisquam est</a>
							</h4> Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit
							aut fugit consequuntur magni.</li>
						<li><strong>May 29, 2010</strong>
							<h4>
								<a href="#">Minima veniam, quis nostrum</a>
							</h4> Uis autem vel eum iure reprehenderit qui in ea voluptate velit
							esse quam nihil molestiae.</li>
					</ul>
				</div>
				<!-- content -->
				<div class="section" id="content">
					<div id="banner">
						
					</div>
					<div class="ic">More Website Templates at
						TemplateMonster.com!</div>
					<div class="inside">
						<h2>
							Contacto
						</h2>
						<div class="address">
							<address>
								
								<strong>Ciudad:</strong>Sangolquí<br/>
								<strong>Telefono:</strong>(02) 3989-400 Ext 2190/2191/2192<br/> 
								
							</address>
							<div class="extra-wrap">
								<h4>Directora:</h4>
								<p>Ing. Karla Benavides
									kvbenavides@espe.edu.ec</p>
							</div>
						</div>
						<h2>
							Formulario de contacto
						</h2>
						<div id="contacts-form" >
							<fieldset>
								<div class="field">
									<label>Nombre:</label> <input type="text" value="" />
								</div>
								<div class="field">
									<label>E-mail:</label> <input type="email" value="" />
								</div>
								
								<div class="field extra">
									<label>Mensaje:</label>
									<textarea cols="1" rows="1"></textarea>
								</div>
								<div class="alignright">
									<a href="#" onClick="document.getElementById('contacts-form').submit()">Enviar mensaje!</a>
								</div>
							</fieldset>
						</div>
					</div>
				</div>

			</div>
		</div>
		<!-- footer -->
		<div class="footer">
			<div class="container">
				<div class="inside">
					<div class="wrapper">
						
					</div>
				</div>
			</div>
		</div>

		<h:outputScript>
		Cufon.now(); 
	</h:outputScript>
	</form>
</h:body>
</html>